<template>
	<view class="dialogue" :style="{ paddingTop: safeAreaTop + 'px' }">
		<up-navbar title="对话" leftIcon="" />
		<view class="mt-2">
			<up-input placeholder="搜索智能体" prefixIcon="search" prefixIconStyle="font-size: 16px;color: #A6A6A6" />
		</view>
		<view class="content mt-2">
			<view class="items flex-r a-c">
				<view class="icon"></view>
				<view class="ml-1 flex1">
					<view class="title">
						循循解惑 <text>循频人类图</text>
					</view>
					<text>1989.12.23 北京市海定区</text>
				</view>
			</view>
			<view class="items flex-r a-c">
				<view class="icon"></view>
				<view class="ml-1 flex1">
					<view class="title">
						手相面相解读
					</view>
					<text>额头宽广通常被认为是聪明、有智慧的象征……</text>
				</view>
			</view>
		</view>
	</view>
</template>

<script setup>
	const safeAreaTop = uni.$safeArea?.safeAreaTop || 44;
</script>

<style lang="scss">
	.dialogue {
		padding: 20rpx;

		.content {
			.items {
				margin-bottom: 40rpx;

				.icon {
					width: 116rpx;
					height: 116rpx;
					background: #334ED5;
					border-radius: 50%;
				}

				.title {
					font-weight: 500;
					font-size: 32rpx;
					color: #000000;
					margin-bottom: 10rpx;
					text{
						font-weight: 500;
						font-size: 20rpx;
						color: #000000;
						background: #FED523;
						border-radius: 8rpx;
						padding: 5rpx 10rpx;
					}
				}

				text {
					font-size: 26rpx;
					color: #A6A6A6;
					line-height: 36rpx;
				}
			}
		}
	}
</style>